<template>
	<view>
<!-- 		<view class="uni-padding-wrap">
			<view class="cu-bar bg-white solid-bottom margin-top">
				<view class="action">
					<text class="cuIcon-title text-blue"></text>完善个人信息
				</view>
			</view>
		</view> -->
		<view class="grid col-1 padding-sm">
			<view class="padding-sm">
				<view class="bg-gradual-blue padding radius text-center shadow-blur">
					<view class="text-lg">{{valiFormData.ksxx.d1}}</view>
					<view class="margin-top-sm text-Abc">{{valiFormData.ksxx.d2}}</view>
				</view>
			</view>
		</view>
		<uni-section title="在线报考" type="line">
			<view class="example" style="padding: 10px;">
				<!-- 基础表单校验 -->
				<uni-forms ref="valiForm" :rules="rules" :model="valiFormData" labelWidth="80px">
					<uni-forms-item label="学院" required name="xy">
					  <uni-data-select
						v-model="valiFormData.xy"
						:localdata="xyrange"
						:clear="false"
					  ></uni-data-select>
					  <!-- <uni-easyinput v-model="valiFormData.xy" placeholder="专业" /> -->
					</uni-forms-item>
					<uni-forms-item label="专业" required name="zy">
					  <uni-data-select
						v-model="valiFormData.zy"
						:localdata="zyrange"
						:clear="false"
					  ></uni-data-select>
						<!-- <uni-easyinput v-model="valiFormData.zy" placeholder="专业" /> -->
					</uni-forms-item>
					<uni-forms-item label="班级" required name="bj">
					  <uni-data-select
						v-model="valiFormData.bj"
						:localdata="bjrange"
						:clear="false"
					  ></uni-data-select>
						<!-- <uni-easyinput v-model="valiFormData.bj" placeholder="班级" /> -->
					</uni-forms-item>
					<uni-forms-item label="姓名" required name="xm">
						<uni-easyinput v-model.trim="valiFormData.xm" placeholder="姓名" />
					</uni-forms-item>
					<uni-forms-item label="性别" required>
						<uni-data-checkbox v-model="valiFormData.xb" :localdata="sexs" />
					</uni-forms-item>
<!-- 					<uni-forms-item label="性别" required name="xb">
						<uni-easyinput v-model="valiFormData.xb" placeholder="性别" />
					</uni-forms-item> -->
					<uni-forms-item label="民族" required name="mz">
					  <uni-data-select
						v-model="valiFormData.mz"
						:localdata="mzrange"
						:clear="false"
					  ></uni-data-select>
						<!-- <uni-easyinput v-model="valiFormData.mz" placeholder="民族" /> -->
					</uni-forms-item>
					<uni-forms-item label="身份证" required name="sfzh">
						<uni-easyinput type="idcard" v-model.trim="valiFormData.sfzh" placeholder="身份证" />
					</uni-forms-item>
					<uni-forms-item label="联系电话" required name="lxdh">
						<uni-easyinput v-model.trim="valiFormData.lxdh" placeholder="联系电话" />
					</uni-forms-item>
					<uni-forms-item label="系别名称" required name="xbmc">
					  <uni-data-select
						v-model="valiFormData.xbmc"
						:localdata="xbmcrange"
						:clear="false"
					  ></uni-data-select>
						<!-- <uni-easyinput v-model="valiFormData.xbmc" placeholder="系别名称" /> -->
					</uni-forms-item>
					<uni-forms-item label="学制" required name="xz">
					  <uni-data-select
						v-model="valiFormData.xz"
						:localdata="xzrange"
						:clear="false"
					  ></uni-data-select>
						<!-- <uni-easyinput v-model="valiFormData.xz" placeholder="学制" /> -->
					</uni-forms-item>
					<uni-forms-item label="学号" required name="xh">
						<uni-easyinput v-model="valiFormData.xh" placeholder="学号" />
					</uni-forms-item>
				</uni-forms>
				<uni-section v-show="valiFormData.sfzh.length == 18" title="请先上传证件照后提交考试表单,图片请用jpg格式" type="line">
					<button type="primary" @click="upImg()">请上传照片</button>
		<!-- 			<view style="padding: 10px;">
						<uni-file-picker 
							ref="files"
							:auto-upload="false"
							:sizeType="sizeType"
							v-model="imageValue"  
							file-mediatype="image"
							:image-styles="imageStyles"
							mode="grid"
							file-extname="jpg"
							:limit="1"
							@success="success" 
							@select="select"
						/>
						<button style="margin: 10px;" type="primary" @click="upload00">上传</button>
					</view> -->
				</uni-section>
				<button type="primary" style="margin-top: 20px;margin-bottom: 20px;" v-if="fbbb" @click="submit('valiForm')">提交</button>
				<!-- <button type="primary" @click="qlhc()">去了缓存</button> -->
			</view>
		</uni-section>
	</view>
</template>


<script>
	var _this;
	var vk = uni.vk;
	import uniForms from "@/pages_bd/components/uni-forms/uni-forms";
	import uniFormsItem from "@/pages_bd/components/uni-forms-item/uni-forms-item";
	import uniFilePicker from "@/pages_bd/components/uni-file-picker/uni-file-picker";
	export default {
		components:{uniForms,uniFormsItem,uniFilePicker},
		data() {
			// 页面数据变量
			return {
				tempFilePath: '',
				percent: 0,
				percentFalg: false,
				fbbb:false,
				imageStyles:{
					border:{
						color:"#2F4056"
					}
				},
				sizeType:['compressed'],
				imageValue:[],
				userdata:{},
				xyranget:'',
				zyranget:'',
				bjranget:'',
				xbmcranget:'',
				xzranget:'',
				mzranget:'',
				xyrange: [{text:'',value:''}],
				zyrange: [{text:'',value:''}],
				bjrange: [{text:'',value:''}],
				xbmcrange: [{text:'',value:''}],
				xzrange: [{text:'',value:''}],
				mzrange: [{text:'',value:''}],
				valiFormData:{
					xy:'',
					zy:'',
					bj:'',
					xm:'',
					mz:'',
					lxdh:'',
					xbmc:'',
					xz:'',
					xh:'',
					sfzh:'',
					xb:'男',
					ksxx:{
						d1:'',
						d2:''
					}
				},
				// 单选数据源
				sexs: [{
					text: '男',
					value: '男'
				}, {
					text: '女',
					value: '女'
				}],
				// 校验规则
				rules: {
					xm: {
						rules: [{
							required: true,
							errorMessage: '姓名不能为空'
						}]
					},
					sfzh: {
						rules: [{
							required: true,
							errorMessage: '身份证'
						},
						{
							minLength: 18,
							maxLength: 18,
							errorMessage: '请输入正确的身份证信息',
						}
						]
					},
					lxdh: {
						rules: [{
							required: true,
							errorMessage: '联系电话'
						},
						{
							minLength: 11,
							maxLength: 11,
							errorMessage: '请输入手机号码',
						}
						]
					},
					xh: {
						rules: [{
							required: true,
							errorMessage: '姓名不能为空'
						}]
					}
				},
				options:{}
			}
		},
		// 监听 - 页面每次【加载时】执行(如：前进) await
		async onLoad(options = {}) {
			_this = this;
			vk = uni.vk;
			this.options = options;
			await this.getxszlzxList();
			await this.getmzlist();
			let tempobj = vk.getStorageSync('ksbm-key');
			if(tempobj){
				this.valiFormData = vk.getStorageSync('ksbm-key');
			}
			this.valiFormData.ksxx = this.options;
			this.valiFormData.userdata = vk.getVuex("$user.userInfo")
			this.valiFormData.opid = vk.getVuex("$user.userInfo.wx_openid.mp-weixin")

			//console.log(this.valiFormData)
		},
		// 监听 - 页面【首次渲染完成时】执行。注意如果渲染速度快，会在页面进入动画完成前触发
		onReady(){
			
		},
		// 监听 - 页面每次【显示时】执行(如：前进和返回) (页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面)
		onShow() {
			
		},
		// 监听 - 页面每次【隐藏时】执行(如：返回)
		onHide() {
			
		},
		// 监听 - 点击右上角转发时
		onShareAppMessage(options) {
			
		},
		// 函数
		methods: {
			upImg111(){
				console.log(_this.valiFormData.sfzh)
				console.log(_this.valiFormData.sfzh.length)
			},
			upImg(){
				uni.chooseImage({
					count: 1,
					sizeType: ['compressed'],
					success(res) {
						_this.tempFilePath = res.tempFilePaths[0]
						//console.log(res.tempFilePaths[0])
						//上传到服务器
						let upload = uni.uploadFile({
							fileType: 'image',
							url:'https://www.hngsxy.com/mybatisplus/gsxyStudentStatusManage/upload',
							 // url:'http://localhost:8080/gsxyStudentStatusManage/upload',
							filePath: _this.tempFilePath,
							name: 'file',
							formData: {
								sfzh: _this.valiFormData.sfzh
							},
							success(res1) {
								let arr = []
								console.log(res1)
								if(res1.statusCode == 200){
									_this.fbbb = true;
									uni.showToast({title:"图片上传成功"})
								}
								// console.log(res1) = res.data.imgpath
							},
							fail(res2){
								uni.showToast({title:"图片上传失败!"})
								_this.percent = 0
								_this.percentFalg = false
								// console.log(res2)
							}
						})
						
					}
				})
			},
			async upload00(){
				await this.$refs.files.upload();
				//this.fbbb = true;
			},
			// 获取上传状态
			select(e){
				console.log('选择文件：',e);
			},
			// 上传成功
			success(e){
				console.log(this.imageValue[0])
				this.valiFormData.image = this.imageValue[0];
			},
			qlhc(){
				vk.removeStorageSync('ksbm-key');
			},
			getxszlzxList(){
				return vk.callFunction({
				  url: 'client/jp/pub/xszlapi.getxszlzxList',
				  title:'请求中...',
				  data:{zxlx:['1','2','3','4','5']}
				}).then((data) => {
				_this.xyrange = [];
				_this.zyrange = [];
				_this.bjrange = [];
				_this.xbmcrange = [];
				_this.xzrange = [];
				  for (let s of data.list) {
				  	if(s.zxlx == '1'){
				  		_this.xyrange.push(s)
						//_this.xyranget = _this.xyrange[0].value
				  	}else if(s.zxlx == '2'){
						_this.zyrange.push(s)
						//_this.zyranget = _this.zyrange[0].value
					}else if(s.zxlx == '3'){
						_this.bjrange.push(s)
						//_this.bjranget = _this.bjrange[0].value
					}else if(s.zxlx == '4'){
						_this.xbmcrange.push(s)
						//_this.xbranget = _this.xbrange[0].value
					}else if(s.zxlx == '5'){
						_this.xzrange.push(s)
						//_this.xzranget = _this.xzrange[0].value
					}
					
				  }
				  _this.valiFormData.xy = _this.xyrange[0].value;
				  _this.valiFormData.zy = _this.zyrange[0].value;
				  _this.valiFormData.bj = _this.bjrange[0].value;
				  _this.valiFormData.xbmc = _this.xbmcrange[0].value;
				  _this.valiFormData.xz = _this.xzrange[0].value;
				}).catch((err) => {
				  
				});
			},
			getmzlist(){
				// promise方式
				return vk.callFunction({
				  url: 'client/jp/pub/xszlapi.getmzList',
				  title:'请求中...',
				  data:{}
				}).then((data) => {
					_this.mzrange = [];
				  for (let s of data.mzjson.list) {
					  s.text = s.name;
					  s.value = s.name;
					  _this.mzrange.push(s);
				  }
				   _this.valiFormData.mz = _this.mzrange[0].value;
				  //_this.mzranget = _this.mzrange[0].value
				}).catch((err) => {
				  
				});
			},
			addxszlOne(){
				vk.callFunction({
				  url: 'client/jp/pub/xszlapi.addxszlOne',
				  title: '请求中...',
				  data: {
					..._this.valiFormData
				  },
				  success: (data) => {
					//console.log(data)
					// if(data.msg == '2'){
					// 	uni.showToast({
					// 		title: `已经报名过了`
					// 	})
					// }else{
					// 	uni.showToast({
					// 		title: `报名成功`
					// 	})
					// }
					vk.redirectTo('/pages_bd/wszl/wdks');
				  },fail:(fail)=>{
					  //console.log(fail)
				  }
				});
			},
			submit(ref) {

				this.$refs[ref].validate().then(res => {
					// console.log('success', res);
					// uni.showToast({
					// 	title: `校验通过`
					// })
					vk.setStorageSync('ksbm-key', _this.valiFormData);
					this.addxszlOne()
				}).catch(err => {
					//console.log('err', err);
				})
			},
			// 页面数据初始化函数
			init(options){
				//vk.reLaunch("/pages_template/uni-id/index/index");
			},
			pageTo(path){
				vk.navigateTo(path);
			}
		},
		// 监听器
		watch:{
			
		},
		// 计算属性
		computed:{
			
		}
	}
</script>
<style lang="scss" scoped>
	
	
</style>